<template>
	<view>
		<view class="report-income">
			<view class="report-income-title">今日收入</view>
			<view class="report-income-word"><text>￥</text>7921.0</view>
		</view>
		
		<view class="report-order">
			<view class="report-order-single">
				<view class="report-order-quantity">
					今日订单:<view>112</view>
				</view>
				<view class="report-order-line"></view>
				<view class="report-order-quantity">
					本周订单:<view>7999</view>
				</view>
			</view>
			<view class="report-order-total">1210单</view>
		</view>
		
		<view class="report-chart">
			<view class="report-chart-list">
				<view class="report-chart-title">昨日营业额</view>
				<view class="report-chart-click">查看具体>></view>
			</view>
			
			<view class="report-chart-list">
				<view class="report-chart-title">本月营业额</view>
				<view class="report-chart-click">查看具体>></view>
			</view>
		</view>
		
		<view class="report-form" @click="salesReportJump">
			<image src="../../static/imges/bg_sales_reports@2x.png" class="report-form-back"></image>
			<view class="report-form-title">销售报表</view>
			<image src="../../static/imges/icon_go_to.png" class="report-form-logo"></image>
		</view>
		
		<view class="report-core">
			<view class="report-core-title">数据分析（线下）</view>
			<view class="report-core-tab"><u-tabs v-model="activeTab" :scroll="false" :tabs="['今日', '昨日', '近7日', '近30日']" @change="selectTab"></u-tabs></view>
			<view class="report-core-item">
				<view class="report-core-list">
					<view class="report-list-title">曝光人数（实时）</view>
					<view class="report-list-word">129<text>人</text></view>
				</view>
				<view class="report-core-list">
					<view class="report-list-title">曝光次数（实时）</view>
					<view class="report-list-word">129<text>次</text></view>
				</view>
			</view>
			<view class="report-core-bottom">
				<view class="report-core-transform">
					<view class="report-transform-title">入店转化率</view>
					<view class="report-transform-about">89.2%</view>
					<view class="report-transform-lift">
						<image src="../../static/imges/icon_go_up@2x.png" class="report-lift-logo"></image>
						<!-- <image src="../../static/imges/icon_go_down@2x.png" class="report-lift-logo"></image> -->
						<view class="report-lift-word">0.60%</view>
					</view>
				</view>
				<view class="report-core-transform report-core-blue">
					<view class="report-transform-title">加购转化率</view>
					<view class="report-transform-about">89.2%</view>
					<view class="report-transform-lift">
						<image src="../../static/imges/icon_go_up@2x.png" class="report-lift-logo"></image>
						<!-- <image src="../../static/imges/icon_go_down@2x.png" class="report-lift-logo"></image> -->
						<view class="report-lift-word">0.60%</view>
					</view>
				</view>
				<view class="report-core-transform report-core-purple">
					<view class="report-transform-title">支付转化率</view>
					<view class="report-transform-about">89.2%</view>
					<view class="report-transform-lift">
						<image src="../../static/imges/icon_go_up@2x.png" class="report-lift-logo"></image>
						<!-- <image src="../../static/imges/icon_go_down@2x.png" class="report-lift-logo"></image> -->
						<view class="report-lift-word">0.60%</view>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import uTabs from '@/components/u-tabs/u-tabs.vue';
	export default {
		components: {
			uTabs
		},
		data() {
			return {
				activeTab: 0,
			}
		},
		onLoad() {

		},
		methods: {
			selectTab(e) {
				this.activeTab = e;
				this.params.page = 1;
				this.orderList = [];
				this.getMyOrdersPage();
			},
			salesReportJump() {
				uni.navigateTo({
					url: '/pages/salesReport/salesReport'
				})
			}
		}
	}
</script>

<style lang="less">
	@import './report.less';
</style>
